/**
 * Created by Lcouncillor on 2020/5/22.
 */
// 图片展示  暂定展示图片数量为4
var picture = 0;
var picsize = 3;
var leftLength = 0;
$('.small-pic').eq(picture).css("border-color","#7fba00")

$('.pre-pic>button').on("click",function () {

    //边框
    if ( picture != 0){
        $('.small-pic').eq(picture).css("border-color","#e7e7e6")
        picture -= 1;
        $('.small-pic').eq(picture).css("border-color","#7fba00");
    }

    //移动
    if ( picture>0 && picture<picsize-1){
        leftLength -= 23;
        $('.smpic-div>div').css("transform","translateX(-"+leftLength+"%)");

    }

    //图片展示
    var picName = $('.small-pic').eq(picture).children().eq(0).children().eq(0).attr("src");
    $('#show-pic').attr("src",picName);
});

$('.next-pic>button').on("click",function () {
    //边框颜色改变
    if ( picture != picsize){
        $('.small-pic').eq(picture).css("border-color","#e7e7e6")
        picture += 1;
        $('.small-pic').eq(picture).css("border-color","#7fba00");
    }

    //移动
    if ( picture > 1 && picture<picsize ){
        leftLength += 23;
        $('.smpic-div>div').css("transform","translateX(-"+leftLength+"%)");

    }

    //图片展示
    var picName = $('.small-pic').eq(picture).children().eq(0).children().eq(0).attr("src");
    $('#show-pic').attr("src",picName);
});

function show_pic(obj){
    
}

//缩小图点击事件（图片展示+边框颜色+位置移动）
$('.small-pic>a').on("click",function () {

    $('.small-pic').css("border-color","#e7e7e6");
    $(this).parent().css("border-color","#7fba00");
    var picUrl = $(this).children().eq(0).attr("src");
    $('#show-pic').attr("src",picUrl);

    //改变当前图片值（不影响按钮的操作）
    var currentHtml = $(this).html();
    var pics = $('.small-pic>a');
    for ( var i=0; i<pics.length; i++){
        var pic = pics[i].innerHTML;
        if ( pic === currentHtml){
            picture = i;
            break;
        }
    }

    //改变div左侧偏移量
    leftLength = get_left(picture);
    $('.smpic-div>div').css("transform","translateX(-"+leftLength+"%)");

    return false;
});

//通过当前图片确定左侧偏移量
function get_left(pic) {
    var value = 0;
    if ( pic>1 && pic<=picsize-1){
        value = 23*(pic-1);
    }else if ( pic === picsize){
        value = 23*(picsize-2);
    }
    return value;
}

$('.amount-minus>button').on("click",function () {
    var amount = parseInt($('.amount-value>input').val());
    if (amount>1){
        $('.amount-value>input').val(amount-1);
    }
});

$('.amount-plus>button').on("click",function () {
    var amount = parseInt($('.amount-value>input').val());
    $('.amount-value>input').val(amount+1);

});
